<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=0.6, user-scalable=0" >
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="css/style-student.css">
    <script src="./js/lib/jquery-3.5.1.min.js"></script>
    <script src="./js/script-affair.js"></script>
    <title>教师事务中心</title>
</head>
<body>
    <!--标题-->
    <div class="info-title">
        <img src="img/logo3.png" alt="logo">
        <span><a href="#">[切换对象]</a></span>
        <span>当前数据对象：2018级 计算机系</span>

    </div>
    <!--导航栏-->
    <div class="navigationBar">
        <div class="sub-navigation" id="sub-navigation-student" style="display: none">
            <div data-name="info" class="hotkey">个人信息</div>
            <div data-name="modify" class="common">修改密码</div>
            <div data-name="activity" class="common">活动列表</div>
            <div data-name="elective" class="common">选  课</div>
            <div data-name="direction" class="common">选 方 向</div>
            <div data-name="exit" class="common">注销退出</div>
        </div>
        <div class="sub-navigation" id="sub-navigation-teacher" style="display: block">
            <div data-name="info-list" class="hotkey">学生列表</div>
            <div data-name="set-activity" class="common">发布活动</div>
            <div data-name="set-elective" class="common">选课设置</div>
            <div data-name="set-direction" class="common">选方向设置</div>
            <div data-name="exit" class="common">注销退出</div>
        </div>
    </div>
    <!--主体内容-->
    <div class="content-box">
        <!--个人信息-->
        <div class="content-body content-info" id="info" style="display: none" >
            <div class="content-info-title">个人信息</div>
            <div id="content-info-box">
                <table class="content-info-table" >
                    <tr class="row">
                        <th class="row-title" >学号</th>
                        <th class="row-content" name="id">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">姓名</th>
                        <th class="row-content" name="name">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">性别</th>
                        <th class="row-content" name="sex">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">年级</th>
                        <th class="row-content" name="grade">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">系</th>
                        <th class="row-content" name="department">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">专业</th>
                        <th class="row-content" name="specialty">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">方向</th>
                        <th class="row-content" name="direction">获取中</th>
                    </tr>
                    <tr class="row">
                        <th class="row-title">班级</th>
                        <th class="row-content" name="class">获取中</th>
                    </tr>
                </table>
            </div>
        </div>
        <!--修改密码-->
        <div class="content-body content-info" id="modify" style="display: none">
            <div class="content-info-title">修改密码</div>
            <div class="input-box">
                <span class="input-title">账户</span>
                <input class="input-input" name="account" type="text" disabled="disabled">
            </div>
            <div class="input-box">
                <span class="input-title">旧密码</span>
                <input class="input-input" name="oldPassword" type="password">
            </div>
            <div class="input-box">
                <span class="input-title">新密码</span>
                <input class="input-input" name="newPassword" type="password">
            </div>
            <div class="input-box">
                <span class="input-title">再确认</span>
                <input class="input-input" name="confirmPassword" type="password">
            </div>
            <div class="input-box" name="input-error" style="display: none">
                <div class="input-error">
                    <div style="float: left;color: #ff7d0a"> ⚠ </div>
                    <div style="padding-left: 24px" name="msg"></div>
                </div>
            </div>
            <div class="button-box" style="margin-bottom: 10px">
                <button id="content-modify-submit">确认修改</button>
            </div>
        </div>
        <!--活动列表-->
        <div class="content-body content-info" id="activity" style="display: none">
            <div class="content-info-title">活动列表</div>
            <p style="text-align: center">暂未开放此模块</p>
        </div>
        <!--选课-->
        <div class="content-body content-info" id="elective" style="display: none">
            <div class="content-info-title">选课设置</div>
            <p style="text-align: center">暂未开放此模块</p>
        </div>
        <!--选方向-->
        <div class="content-body content-info" id="direction" style="display: none">
            <div class="content-info-title">选方向</div>
            <div class="input-box">
                <span class="input-title">账户</span>
                <input class="input-input" type="text" disabled="disabled" value="6018203029">
            </div>
            <div class="input-box">
                <span class="input-title">姓名</span>
                <input class="input-input" type="text" disabled="disabled" value="王延周">
            </div>
            <div class="input-box">
                <span class="input-title">专业</span>
                <input class="input-input" type="text" disabled="disabled" value="计算机科学与技术">
            </div>
            <div class="input-box">
                <span class="input-title">方向</span>
                <label>
                    <select class="input-input">
                        <option value="">--请选择方向--</option>
                        <option value="1">计算机技术</option>
                        <option value="2">云计算平台</option>
                    </select>
                </label>
            </div>
            <div class="button-box" style="margin-bottom: 10px">
                <button>确认提交</button>
            </div>
        </div>

        <!--学生信息表-->
        <div class="content-body content-list" id="list" style="display: none">
            <div class="content-list-title">学生信息</div>
            <div class="content-list-operating">
                <div class="content-list-row">
                    <label>
                        每页显示数量:
                        <select name="pagination">
                            <option value="10">10</option>
                            <option value="25">25</option>
                            <option value="50">50</option>
                            <option value="100">100</option>
                        </select>
                    </label>
                    <button id="button-insert">新增</button>
                </div>
                <div class="content-list-search">
                    <button id="button-emptyTemplate">空模板</button>
                    <button id="button-export">导出</button>
                    <button id="button-import">导入</button>
                    <label>
                        搜索
                        <input type="text">
                    </label>
                    <button>搜索</button>
                </div>
            </div>
            <div class="content-list-box">
                <table class="manage-table">
                    <thead>
                        <tr class="head">
                            <th>学号</th>
                            <th>姓名</th>
                            <th>性别</th>
                            <th>年级</th>
                            <th>系</th>
                            <th>专业</th>
                            <th>方向</th>
                            <th>班级</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody id="manage-body"><!--列表内容--></tbody>
                </table>
            </div>
            <div class="content-list-page">
                <ul class="pagination">
                    <li><a class="page-link">首页</a></li>
                    <li><a class="page-link page-link-in">1</a></li>
                    <li><a class="page-link">末页</a></li>
                </ul>
            </div>

        </div>
        <!--活动设置-->
        <div class="content-body content-info" id="set-activity" style="display: none">
            <div class="content-info-title">活动设置</div>
            <p style="text-align: center">暂未开放此模块</p>
        </div>
        <!--选课设置-->
        <div class="content-body content-info" id="set-elective" style="display: none">
            <div class="content-info-title">选课设置</div>
            <p style="text-align: center">暂未开放此模块</p>
        </div>
        <!--选方向设置-->
        <div class="content-body content-air" id="set-direction" style="display: none">
            <div class="content-list content-direction">
                <div data-name="direction-set" class="hotkey">方向设置</div>
                <div data-name="direction-statistics" class="common">图形统计</div>
                <div data-name="direction-already" class="common">已选列表</div>
                <div data-name="direction-haveNot" class="common">未选列表</div>
            </div>

            <div class="content-list content-direction-box">
                <div class="content-direction-body" id="direction-set">
                    <div class="content-list-title">方向设置</div>
                    <div style="float: left">
                        <span style="font-size: 18px;">开启选方向：</span>
                    </div>
                    <div >
                        <label class="input-switch" >
                            <input type="checkbox">
                            <span class="slider round"></span>
                        </label>
                    </div>
                    <div>
                        <div class="content-list-box">
                            <table class="manage-table">
                                <thead>
                                <tr class="head">
                                    <th>id</th>
                                    <th>所属系</th>
                                    <th>所属专业</th>
                                    <th>方向名</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody id="manage-body-s">
                                <tr class="singular">
                                    <th>1</th>
                                    <th>计算机科学与技术</th>
                                    <th>计算机科学与技术</th>
                                    <th>计算机技术</th>
                                    <th>
                                        <button class="button-modify">修改</button>
                                        <button class="button-del">删除</button>
                                    </th>
                                </tr>
                                <tr class="dual">
                                    <th>2</th>
                                    <th>计算机科学与技术</th>
                                    <th>计算机科学与技术</th>
                                    <th>云计算平台</th>
                                    <th>
                                        <button class="button-modify">修改</button>
                                        <button class="button-del">删除</button>
                                    </th>
                                </tr>
                                <tr class="singular">
                                    <th>3</th>
                                    <th>计算机科学与技术</th>
                                    <th>计算机科学与技术</th>
                                    <th>物联网</th>
                                    <th>
                                        <button class="button-modify">修改</button>
                                        <button class="button-del">删除</button>
                                    </th>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--底部信息栏-->
    <div class="copyright">版权所有 © 2020–2024 天津大学仁爱学院计算机科学技术系. 保留全部权利。</div>
    <!--弹出框-->
    <div class="pop-up-box" id="pop-up-box" style="display: none">
        <!--学生修改-->
        <div id="pop-up-modify" style="display: none">
            <div class="title">
                <div name="title" style="float: left">
                    修改学生信息
                </div>
                <div class="close">
                    ×
                </div>
            </div>
            <div class="content" id="pop-up-student-modify">
                <div class="input-box">
                    <span class="input-title">学号</span>
                    <input class="input-input" name="sno" type="text" disabled="disabled">
                </div>
                <div class="input-box">
                    <span class="input-title">姓名</span>
                    <input class="input-input" name="name" type="text">
                </div>
                <div class="input-box">
                    <span class="input-title">密码</span>
                    <input class="input-input" name="password" type="password" placeholder="留空为不修改密码">
                </div>
                <div class="input-box">
                    <span class="input-title">性别</span>
                    <label>
                        <select class="input-input" name="sex">
                            <option value="" >--请选择性别--</option>
                            <option value="男">男</option>
                            <option value="女">女</option>
                        </select>
                    </label>
                </div>
                <div class="input-box">
                    <span class="input-title">年级</span>
                    <label>
                        <select class="input-input" name="grade">
                            <option value="">--请选择年级--</option>
                        </select>
                    </label>
                </div>
                <div class="input-box">
                    <span class="input-title">系</span>
                    <label>
                        <select class="input-input" name="departments">
                            <option value="">--请选择系--</option>
                        </select>
                    </label>
                </div>
                <div class="input-box">
                    <span class="input-title">专业</span>
                    <label>
                        <select class="input-input" name="specialties">
                            <option value="">--请选择专业--</option>
                        </select>
                    </label>
                </div>
                <div class="input-box">
                    <span class="input-title">方向</span>
                    <label>
                        <select class="input-input" name="directions">
                            <option value="">--请选择方向--</option>
                        </select>
                    </label>
                </div>
                <div class="input-box">
                    <span class="input-title">班级</span>
                    <label>
                        <select class="input-input" name="clazz">
                            <option value="">--请选择班级--</option>
                        </select>
                    </label>
                </div>
                <div class="input-box" name="input-error" style="display: none">
                    <div class="input-error">
                        <div style="float: left;color: #ff7d0a"> ⚠ </div>
                        <div style="padding-left: 24px" name="msg"></div>
                    </div>
                </div>
                <div class="button-box" style="margin-bottom: 10px">
                    <button id="pop-up-submit">确认修改</button>
                </div>
            </div>
        </div>
        <div id="pop-up-upload" style="display: none">
            <div class="title">
                <div name="title" style="float: left">
                    导入学生信息
                </div>
                <div class="close">
                    ×
                </div>
            </div>
            <div class="content">
                <div class="input-box">
                    <span class="input-title">文件</span>
                    <input class="input-input input-file" id="upload-file" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel">
                </div>
                <div class="input-box">
                    <span class="input-title">状态</span>
                    <input class="input-input" type="text" disabled="disabled" value="等待上传">
                </div>
                <div class="input-box">
                    <span class="input-title">返回</span>
                    <div class="input-input">
                        <button style="margin-top: 5px" id="exportMistake-file">导出错误</button>
                    </div>
                </div>
                <div class="button-box" style="margin-bottom: 10px">
                    <button id="button-upload-submit">开始上传</button>
                </div>
            </div>
        </div>
    </div>
</body>
</html>
